<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>购买商品</title>
    <script src="js/flexible.js"></script>
    <link rel="stylesheet" href="css/flexible.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/vant.css">
    <script src="js/vue/vue.js"></script>
    <script src="js/vue/axios.js"></script>
    <script src="js/vue/MD5.js"></script>
    <script src="js/vue/vant.js"></script>
    <script src="js/vue/qs.js"></script>
</head>
<body style="background-color: #F6F6F6;">
<div id="app">
    <div class="card_banner qxk">
        <div class="name">{{from.goodsname}}</div>
        <div class="jg"><span class="l">巨惠价格</span><span class="r">￥{{from.price}}</span></div>
        <div class="clear"></div>
    </div>
    <div class="mg h10"></div>
    <div class="check">
        <div class="check_title">支付</div>
        <div class="select">
            <div class="icon"><img src="images/wx.png" alt="支付方式"></div>
            <div class="zffs">
                <div class="l">微信支付</div>
                <div class="r"><img src="images/xz.png" alt=""></div>
                <!--<div class="r"><img src="images/wxz.png" alt=""></div>-->
            </div>
        </div>
    </div>
    
    <div class="card_down">
        <div class="btn" @click="callpay">立即购买</div>
        <div class="Address" style="display: none">{{from.editAddress}}</div> 
    </div>
</div>
</body>
<script>
new Vue({
    el: '#app',
    data: {
       code:'',
       token:'',
       from:{},
       editAddress:''
    },
    created(){
        this.setCanS()
    },
    methods:{
        //设置参数
        setCanS(){
            let Request = new Object()
            Request = GetRequest()
            this.code = Request['code']
            //this.token = Request['token']
            this.getlists()
            if (typeof WeixinJSBridge == "undefined"){
		    if( document.addEventListener ){
                 document.addEventListener('WeixinJSBridgeReady', this.editAddress, false);
                }else if (document.attachEvent){
                    document.attachEvent('WeixinJSBridgeReady', this.editAddress); 
                    document.attachEvent('onWeixinJSBridgeReady', this.editAddress);
                }
            }else{
                this.editAddress();
            }
        },
        getlists(){
            const params={
                code:this.code,
                ordernum:sessionStorage.getItem('ordernum')
            }
            getVs()
            axios.get('/mobileapi/pay/example/wxjsapi_buycard.php',{params:params}).then(data =>{
                console.log(data.data)
                let { msg, code,user} = data.data
                    if (code !== 200) {
                        window.vant.Toast.fail(msg)
                    } else {
                      this.from=data.data.data
                      let fromAddress= this.from.editAddress
                      sessionStorage.setItem('fromAddress',fromAddress)
                    }
                }).catch(function (error) {
                  console.log(error); 
            })
        },
        jsApiCall(){
            WeixinJSBridge.invoke(
                'getBrandWCPayRequest',
                JSON.parse(this.from.jsApiParameters),
                function(res){
                    WeixinJSBridge.log(res.err_msg);
                   //alert(res.err_code+res.err_desc+res.err_msg);
                   window.location.href='index.html'
                }
            )
        },
        callpay(){
            if (typeof WeixinJSBridge == "undefined"){
                if( document.addEventListener ){
                    document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                }else if (document.attachEvent){
                    document.attachEvent('WeixinJSBridgeReady', jsApiCall); 
                    document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                }
            }else{
                this.jsApiCall();
            }
        },
        editAddress()
            {
                WeixinJSBridge.invoke(
                    'editAddress',
                    JSON.parse(this.from.editAddress),
                    function(res){
                        var value1 = res.proviceFirstStageName;
                        var value2 = res.addressCitySecondStageName;
                        var value3 = res.addressCountiesThirdStageName;
                        var value4 = res.addressDetailInfo;
                        var tel = res.telNumber;
                        
                        alert(value1 + value2 + value3 + value4 + ":" + tel);
                    }
                );
            }
    }
})       
</script>     
</html>